import React, { Component } from 'react'
import {
  View,
  StyleSheet,
  Image,
  Text,
  TouchableOpacity,
} from 'react-native'

import NavBar from '../../../../components/PublicHeader';
import fetchWebApi from '../../../../public/WebApi/fetchBase';
import {
  Images
} from '../../../../public/images/images';
import {
  VERSION_SEARCH
} from '../../../../public/WebApi/apiList';

export default class aboutJX extends Component {
  constructor(props) {
    super(props)
    this.state = {
      returnIcon: require("../../../../assets/images/iconResources/returnBnt1.png"),
      newVersion: null
    }
  }

  componentDidMount = () => {
    // 初始化当前版本号
    this.versionCodeFN()

  }
  // 获取当前版本号
  async versionCodeFN() {
    const res = await fetchWebApi(VERSION_SEARCH,
      {

      }, 'GET');
    if (res.data) {
      this.setState({
        newVersion: res.data
      })
    }

  }

  render() {
    const {
      returnIcon,
      newVersion
    } = this.state
    return (
      <View style={styles.warper}>
        <NavBar
          navigation={this.props.navigation}
          title={"关于俊码星球"}
        />
        <View style={{
          flexDirection: "column",
          justifyContent: "center",
          alignItems: "center"
        }}>
          <Image style={{
            width: 100,
            height: 100,
            marginTop: 40,
            marginBottom: 10,
            resizeMode: 'center'
          }} source={Images.jxs} />
          <Text style={{
            fontSize: 16,
            color: "#000",
            fontWeight: "600"
          }}>俊码星球 V{newVersion}</Text>
        </View>
        <View style={styles.tabList}>
          <TouchableOpacity onPress={() => {
            this.props.navigation.push('userAgreement')
          }}>
            <View style={styles.item}>
              <Text style={styles.title}>用户协议</Text>
              <View style={styles.row}>
                <Text style={styles.describe}>
                </Text>
                <Image style={styles.SystemPrompt} source={returnIcon} />
              </View>
            </View>
          </TouchableOpacity>
          <View style={styles.item}>
            <Text style={styles.title}>服务热线</Text>
            <View style={styles.row}>
              <Text style={styles.describe}>
                400-888-9999
              </Text>
              <Image style={styles.SystemPrompt} source={returnIcon} />
            </View>
          </View>
          <View style={styles.item}>
            <Text style={styles.title}>第三方收集使用个人信息列表</Text>
            <View style={styles.row}>
              <Text style={styles.describe}>
              </Text>
              <Image style={styles.SystemPrompt} source={returnIcon} />
            </View>
          </View>
        </View>
      </View >
    )
  }
}
const styles = StyleSheet.create({
  warper: {
    flex: 1,
  },
  tabList: {
    paddingLeft: 15,
    paddingRight: 15,
    marginTop: 40,
    flex: 1,
    backgroundColor: "#fff"
  },
  item: {
    height: 55,
    flexDirection: "row",
    justifyContent: "space-between",
    alignItems: "center",
    marginTop: 5,
  },
  row: {
    flexDirection: "row",
    alignItems: "center"
  },
  headPortrait: {
    width: 45,
    height: 50,
    borderRadius: 5
  },
  describe: {
    fontSize: 13,
    color: "#666",
    overflow: 'hidden'
  },
  SystemPrompt: {
    width: 15,
    height: 20,
    marginLeft: 20
  },
  title: {
    fontSize: 15,
    color: "#555",
    marginBottom: 7,
    lineHeight: 55,
    fontWeight: "700"
  },
})